XPages Theme: onLoad, output script, insight and example...

HCL Notes/Domino 8.5 Forum (includes Notes Traveler)

Subject:

The .XSP tag, <xp:view> maps to the .HTML <body> tag. The base themeID for the <xp:view> tag is ViewRoot. You have called out ViewBody as the themeID - please ensure you have set this themeID on your pages <xp:view> tag.

For the controls that you have effected the onclick event, these are client-side events. You are essentially defining the passthrough onclick attribute for the rendered HTML tag. This is quite different than the server-side XPage page events (beforePageLoad, afterPageLoad, etc). This events execute on the server-side, therefore document.write(), window.alert(), and any other client-side DOM JS calls do not apply.

Therefore, you are best to implement your solution using an Output script control (see figure below - find it under the "Other... Other controls..." section of the control library), with a themeID mapping into a theme declaration for that control, and a value property. The value (within the theme declaration) would contain the required client-side JS to write into your page header, add to the onload queue, etc. In doing so, you can leverage inline server-side JS that gets preprocessed within the value fragment.

eg:

1. Theme Control declaration and definition


<control>
<name>browser.info.script</name>
<property>
<name>value</name>
<value>
function getBrowserInfo(){
// get the browser info using this
// server-side JS preprocessed expression...
var userAgentString = "#{javascript:context.getUserAgent().getUserAgent()}";

// get the span i want to write into on page load...
var computedField1 = XSP.getElementById("#{id:computedField1}");
computedField1.innerHTML = "<b>" + userAgentString + "</b>";
}

// run on page load queue...
XSP.addOnLoad(getBrowserInfo);
</value>
</property>
</control>

2. .xsp markup with OutputScript control and themeId mapping back to .theme declaration

<?xml version="1.0" encoding="UTF-8"?>
<xp:view xmlns:xp="http://www.ibm.com/xsp/core">
<xp:scriptBlock
id="scriptBlock1"
themeId="browser.info.script">
</xp:scriptBlock>
<xp:text escape="true" id="computedField1"></xp:text>
</xp:view>

3. Resultant .xsp page in the browser